<template>
    <div class="addForm" v-loading="loading">
       
        <div class="addForm_for">
            <el-form ref="formDataRef" :model="formData" :rules="rules" label-width="120px"
                style="padding-bottom: 85px;">
                <el-row>
                    <el-form-item label="招商员部门" prop="brandName">
                        <el-input v-model="AddFormlist.deptName"
                            :disabled="true"
                            clearable placeholder="" maxlength="50" />
                    </el-form-item>
                </el-row>
				<el-row>
				    <el-form-item label="招商员姓名" prop="brandName">
				        <el-input v-model="AddFormlist.nickName"
				            :disabled="true"
				            clearable placeholder="" maxlength="50" />
				    </el-form-item>
				</el-row>
				<el-row>
				    <el-form-item label="招商员花名" prop="brandName">
				        <el-input v-model="AddFormlist.stageName"
				            :disabled="true"
				            clearable placeholder="" maxlength="50" />
				    </el-form-item>
				</el-row>
                <el-row id="cooperation_information">
                    <el-col :span="24" class="fontWeight600 mb25">
                        修改信息
                    </el-col>
                </el-row>
				<el-row>
				    <el-form-item label="上品数" prop="brandName">
				        <el-input v-model="AddFormlist.upperNum"
				            :disabled="true"
				            clearable placeholder="" maxlength="50" />
				    </el-form-item>
				</el-row>
				<el-row>
				    <el-form-item label="今日新增上品数" prop="upperNum">
				        <el-input v-model="formData.upperNum"
				             placeholder="" maxlength="50" />
				    </el-form-item>
				</el-row>
				<el-row>
				    <el-form-item label="爆品数" prop="brandName">
				        <el-input v-model="AddFormlist.hotNum"
				            :disabled="true"
				            clearable placeholder="" maxlength="50" />
				    </el-form-item>
				</el-row>
				<el-row>
				    <el-form-item label="今日新增爆品数" prop="hotNum">
				        <el-input v-model="formData.hotNum"
				             placeholder="" maxlength="50" />
				    </el-form-item>
				</el-row>
				<el-row>
				    <el-form-item label="卷品数" prop="brandName">
				        <el-input v-model="AddFormlist.involutionNum"
				            :disabled="true"
				            clearable placeholder="" maxlength="50" />
				    </el-form-item>
				</el-row>
				<el-row>
				    <el-form-item label="今日新增卷品数" prop="involutionNum">
				        <el-input v-model="formData.involutionNum"
				             placeholder="" maxlength="50" />
				    </el-form-item>
				</el-row>
                <div class="btn_tow_box"
					style="position: absolute;bottom: 0;left: 0;background-color: #fff;width: 100%;padding: 20px;">
					<el-row >
						<el-col :span="24">
							<el-form-item>
								<el-button type="primary" :loading="buttonLoading"
									@click="submitForm(formDataRef)">提交</el-button>
								<el-button @click="resetForm(formDataRef)">取消</el-button>
							</el-form-item>
						</el-col>
					</el-row>
				</div>
            </el-form>
        </div>
        <Point v-if="isTaxRule" @close="isTaxRule = false" />
    </div>
</template>

<script setup lang="ts">
import { defineEmits, defineProps } from 'vue'
const { proxy } = getCurrentInstance() as any;
import { 
	hmRankingedit
} from '@/api/group/list/index'

import { Plus } from '@element-plus/icons-vue'
import visaExemption from '@/assets/images/visaExemption.png'
const icon_lvseduihao = new URL("@/assets/images/icon_lvseduihao.png", import.meta.url).href;
const icon_wenhaohongse = new URL("@/assets/images/icon_wenhaohongse1.png", import.meta.url).href;
const { hm_trade_type } = toRefs<any>(proxy?.useDict('hm_trade_type'));
const { hm_cooperation_mode } = toRefs<any>(proxy?.useDict('hm_cooperation_mode'));
const { hm_discount } = toRefs<any>(proxy?.useDict('hm_discount'));
const { hm_express } = toRefs<any>(proxy?.useDict('hm_express'));
import jsonData from './compoments/address.json';
import icon_shanchu from '@/assets/images/icon_shanchu.png'
import { listHmContract } from '@/api/system/hmContract';
import { hmSupplierList } from '@/api/group/supplier/index'
import { loginSupplierByRoleList } from '@/api/group/supplier/index'
import { getCategoryLists } from '@/api/group/productOutbound/index'
import { addHmProducts, hmProductsEdit } from '@/api/system/supplierAddProducts/index'
import { getSupplierAddProducts } from '@/api/system/supplierAddProducts/index'
import { exportCertId } from '@/api/group/investmentPromotion/index'
import Point from './compoments/point.vue'
const router = useRouter();
const props = defineProps(['title', 'AddFormId', 'disabledName','AddFormlist'])
const emit = defineEmits(['onSubmit'])
const options = jsonData
const screenIndex = ref(0)
const loading = ref(false)
const isTaxRule = ref(false)
const formDataRef = ref()
const cascaderAddr = ref()
const mechanismArr = ref([1])
const isDisabled = ref(false)
const upperNum = ref(props.AddFormlist.todayUpperNum)
const hotNum = ref(props.AddFormlist.todayHotNum)
const involutionNum = ref(props.AddFormlist.todayInvolutionNum)
// 正整数验证
const positiveInteger = (ruls: any, val: string) => {
    if (val) {
         // /^[0-9]+$/.test(val);
		return /^[1-9]\d*$/.test(val) || /^0$/.test(val);
    } else {
        return true
    }
}
const rules = ref({
    upperNum: [
        { required: true, message: '请输入', trigger: 'blur' },
        { validator: positiveInteger, message: '请输入正确的正整数', trigger: 'change' },
    ],
	hotNum: [
	    { required: true, message: '请输入', trigger: 'change' },
	    { validator: positiveInteger, message: '请输入正确的正整数', trigger: 'change' },
	],
	involutionNum: [
	    { required: true, message: '请输入', trigger: 'blur' },
	    { validator: positiveInteger, message: '请输入正确的正整数', trigger: 'change' },
	], 
})
const formData = ref<any>({
	upperNum:props.AddFormlist.todayUpperNum,
	hotNum:props.AddFormlist.todayHotNum,
	involutionNum:props.AddFormlist.todayInvolutionNum,
})
const buttonLoading = ref(false);
// 供应商数据
const supplierData = ref<any>({})
//走仓列表数据
const hm_warehouse = ref([
    {
        value: 1,
        label: '是',
    },
    {
        value: 0,
        label: '否',
    },

])

// 品牌效验
const validatorNumberBrand = (ruls: any, val: string) => {
    if (val) {
        return /^[\u0020-\u007e\u4e00-\u9fa5]+$/.test(val);
    } else {
        return true
    }
}
// 69码效验
const validatorStyleCode = (ruls: any, val: string) => {
    if (val) {
        return /^[0-9]{3,13}$/.test(val)
    } else {
        return true
    }
}
// 售价效验
const validatorNumber = (ruls: any, val: string) => {
    return /(^(?!0\d)([1-9]\d{0,8}(\.\d{1,2})?|0(\.\d{1,2})?)$)/.test(val);
}
// 平台扣点效验，佣金校验
const validatorcommission = (ruls: any, val: string) => /^(([1-9]?\d(\.\d{1,2})?)|100|100.00)$/.test(val);
// 成本效验
const validatorNumbercostPrice = (ruls: any, val: string) => {
    if (formData.value.cooperationMode == '分佣') {
        if (val) {
            return /(^(?!0\d)([1-9]\d{0,8}(\.\d{1,2})?|0(\.\d{1,2})?)$)/.test(val);
        } else {
            return true
        }
    } else if (formData.value.cooperationMode == '') {
        return true
    } else {
        return /(^(?!0\d)([1-9]\d{0,8}(\.\d{1,2})?|0(\.\d{1,2})?)$)/.test(val);
    }
}
const validatorNumbercostPrice2 = (ruls: any, val: string) => {
    if (formData.value.cooperationMode2 == '分佣') {
        if (val) {
            return /(^(?!0\d)([1-9]\d{0,8}(\.\d{1,2})?|0(\.\d{1,2})?)$)/.test(val);
        } else {
            return true
        }
    } else if (formData.value.cooperationMode2 == '') {
        return true
    } else {
        return /(^(?!0\d)([1-9]\d{0,8}(\.\d{1,2})?|0(\.\d{1,2})?)$)/.test(val);
    }
}
const validatorNumbercostPrice3 = (ruls: any, val: string) => {
    if (formData.value.cooperationMode3 == '分佣') {
        if (val) {
            return /(^(?!0\d)([1-9]\d{0,8}(\.\d{1,2})?|0(\.\d{1,2})?)$)/.test(val);
        } else {
            return true
        }
    } else if (formData.value.cooperationMode3 == '') {
        return true
    } else {
        return /(^(?!0\d)([1-9]\d{0,8}(\.\d{1,2})?|0(\.\d{1,2})?)$)/.test(val);
    }
}
// 补充佣金校验
const validatorbrokerage = (ruls: any, val: string) => {
    if (val) {
        return /^(([1-9]?\d(\.\d{1,2})?)|100|100.00)$/.test(val);
    } else {
        return true
    }
}
// 历史最低售价
const validatorPrice = (ruls: any, val: string) => {
    if (val) {
        return /(^(?!0\d)([1-9]\d{0,8}(\.\d{1,2})?|0(\.\d{1,2})?)$)/.test(val)
    } else {
        return true
    }
}




// 供应商下拉列表
const SupplierList = ref<Array<any>>([]);
// 类目列表
const categoryList = ref<Array<any>>([]);

const supplierLoading = ref(true)
const supplierNameDate = ref({
    pageNum: 1,
    pageSize: 10,
    supplierName: ''
})
const supplierQueryLoading = ref(false)
const supplierNametotal = ref()


// 提交
const submitForm = async (formEl: any) => {
    if (!formEl) return
    await formEl.validate(async (valid: any, fields: any) => {
        if (valid) {
            loading.value = true
            buttonLoading.value = true;
            try {
				const res = await hmRankingedit({
					hotNum:parseInt(formData.value.hotNum),
					upperNum:parseInt(formData.value.upperNum),
					involutionNum:parseInt(formData.value.involutionNum),
					recruitUserId:props.AddFormlist.recruitUserId
				});
				ElMessage({
					message: '修改成功',
					type: 'success',
				})
				loading.value = false
				buttonLoading.value = false;
                emit('onSubmit')
            } catch (error) {
                loading.value = false
                buttonLoading.value = false;
            }
        } else {
            console.log('error submit!', fields)
        }
    })
}
// 重置
const resetForm = (formEl: any) => {
    if (!formEl) return
    formData.value = {
        supplierName: "",
        supplierId: "",
        styleName: "",
        productCategoryName: '',
        productCategoryIs: false,
        categoryId: "",
        brandName: "",
        styleCode: "",
        tradeMode: "",
        discountPrice: "",
        specs: "",
        ingredient: "",
        warehouse: "",
        groupName: "",
        sellingPoints: "",
        productImage: "",
        tax: '',

        cooperationMode: "",
        price: "",
        costPrice: "",
        liveStreamingMechanism: "",
        commission: "",
        brokerage: "",

        cooperationMode2: "",
        price2: "",
        costPrice2: "",
        liveStreamingMechanism2: "",
        commission2: "",
        brokerage2: "",

        cooperationMode3: "",
        price3: "",
        costPrice3: "",
        liveStreamingMechanism3: "",
        commission3: "",
        brokerage3: "",

        deliveryTime: "",
        placeDelivery: "",
        placeDeliveryId: "",
        logistics: "",
        eligibility: "",
        factoryStockNum: "",
        noSendArea: "",
        voucherImage: "",
        otherImage: "",
        customsDeclarationImage: "",
        customsInformationImage: "",
        customsInspectionImage: "",
        customsTestReportImgae: "",
    }
    emit('onSubmit')
}
// select选择处理
const optionChange = (e: string, key: string, arr: Array<any>) => {
    const data = arr.find(item => {
        return item.id === e
    })
    if (data) {
        formData.value[key] = data[key]
    }
}
// 输入事件、禁用规则
const forbidRule = (e: string, key: string, type: string) => {
    // 输入法表情默认不能输入
    if (type == 'emoji') {
        // emoji：输入时禁用输入法表情
        formData.value[key] = e.replace(/[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF][\u200D|\uFE0F]|[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF]|[0-9|*|#]\uFE0F\u20E3|[0-9|#]\u20E3|[\u203C-\u3299]\uFE0F\u200D|[\u203C-\u3299]\uFE0F|[\u2122-\u2B55]|\u303D|[\A9|\AE]\u3030|\u00A9|\u00AE|\u3030/gi, '')
    } else if (type == 'blank') {
        // blank：输入时禁用空格
        formData.value[key] = e.replace(/\s|[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF][\u200D|\uFE0F]|[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF]|[0-9|*|#]\uFE0F\u20E3|[0-9|#]\u20E3|[\u203C-\u3299]\uFE0F\u200D|[\u203C-\u3299]\uFE0F|[\u2122-\u2B55]|\u303D|[\A9|\AE]\u3030|\u00A9|\u00AE|\u3030/gi, '')
    }
}
// 机制选择合作方式清楚其余数据
const mechanismChange = (key: string) => {
    if (key === '1') {
        formData.value.price = ''
        formData.value.costPrice = ''
        formData.value.liveStreamingMechanism = ''
        formData.value.commission = ''
        formData.value.brokerage = ''
        formDataRef.value.clearValidate('price')
        formDataRef.value.clearValidate('costPrice')
        formDataRef.value.clearValidate('liveStreamingMechanism')
        formDataRef.value.clearValidate('commission')
        formDataRef.value.clearValidate('brokerage')
    }
    if (key === '2') {
        formData.value.price2 = ''
        formData.value.costPrice2 = ''
        formData.value.liveStreamingMechanism2 = ''
        formData.value.commission2 = ''
        formData.value.brokerage2 = ''
        formDataRef.value.clearValidate('price2')
        formDataRef.value.clearValidate('costPrice2')
        formDataRef.value.clearValidate('liveStreamingMechanism2')
        formDataRef.value.clearValidate('commission2')
        formDataRef.value.clearValidate('brokerage2')

    }
    if (key === '3') {
        formData.value.price3 = ''
        formData.value.costPrice3 = ''
        formData.value.liveStreamingMechanism3 = ''
        formData.value.commission3 = ''
        formData.value.brokerage3 = ''
        formDataRef.value.clearValidate('price3')
        formDataRef.value.clearValidate('costPrice3')
        formDataRef.value.clearValidate('liveStreamingMechanism3')
        formDataRef.value.clearValidate('commission3')
        formDataRef.value.clearValidate('brokerage3')
    }

}
// 处理商品类目名称
const categoryIdChange = (value: any) => {
    if (value && value.length) {
        formData.value.productCategoryName = cascaderAddr.value.getCheckedNodes()[0].pathLabels.join(',')
        let name = cascaderAddr.value.getCheckedNodes()[0].pathLabels.join(',')
        if (name.indexOf('饰品') < 0) {
            formData.value.productCategoryIs = false
            formData.value.warehouse = ''
        } else {
            formData.value.productCategoryIs = true
        }
    } else {
        formData.value.productCategoryName = ''
        formData.value.productCategoryIs = false
        formData.value.warehouse = ''
    }
}
/** 补充机制 */
const addMechanism = (index: number) => {
    mechanismArr.value.push(index)
}
onMounted(() => {
    GetCategoryLists()
    if (props.title === '查看详情') {
        isDisabled.value = true
    } else {

    }
    if (props.title === '查看详情' || props.title === '编辑商品') {
        getLook()
    }
})
// 获取供应商列表
const getListHmContract = async () => {
    supplierLoading.value = true
    const res = await loginSupplierByRoleList(supplierNameDate.value)
    const reshandle = res.rows.map((item: any) => (
        {
            label: item.supplierName,
            value: item.id
        }
    ))
    SupplierList.value.push(...reshandle)
    supplierNametotal.value = res.total
    supplierLoading.value = false
}
/** select懒加载 */
const selectLoad = async () => {
    if (SupplierList.value.length < supplierNametotal.value) {
        supplierNameDate.value.pageNum++;
        getListHmContract()
    }
}
/** 远程搜索 */
const searchQuery = async (query: string) => {
    supplierQueryLoading.value = true
    SupplierList.value = []
    supplierNameDate.value.pageNum = 1;
    supplierNameDate.value.pageSize = 10
    supplierNameDate.value.supplierName = query
    await getListHmContract()
    supplierQueryLoading.value = false
}
/** 清空供应商 */
const handleClear = () => {
    supplierNameDate.value.supplierName = ''
    SupplierList.value = []
    supplierNameDate.value.pageNum = 1;
    supplierNameDate.value.pageSize = 10
    getListHmContract()
}
// 获取所有类目
const GetCategoryLists = async () => {

    const { data = [] } = await getCategoryLists()
    categoryList.value = data

}
watchEffect(() => {
    // 监听平台扣点，售价，佣金，补充佣金，动态计算成本
    if (formData.value.cooperationMode === '分佣') {
        let costPrice = Number(formData.value.price || 0) * (1 - ((Number(formData.value.commission || 0) / 100) + (Number(formData.value.brokerage || 0) / 100) + (Number(formData.value.tax || 0) / 100)))
        formData.value.costPrice = isNaN(costPrice) ? 0 : costPrice.toFixed(2)
    }
    if (formData.value.cooperationMode2 === '分佣') {
        let costPrice2 = Number(formData.value.price2 || 0) * (1 - ((Number(formData.value.commission2 || 0) / 100) + (Number(formData.value.brokerage2 || 0) / 100) + (Number(formData.value.tax || 0) / 100)))
        formData.value.costPrice2 = isNaN(costPrice2) ? 0 : costPrice2.toFixed(2)
    }
    if (formData.value.cooperationMode3 === '分佣') {
        let costPrice3 = Number(formData.value.price3 || 0) * (1 - ((Number(formData.value.commission3 || 0) / 100) + (Number(formData.value.brokerage3 || 0) / 100) + (Number(formData.value.tax || 0) / 100)))
        formData.value.costPrice3 = isNaN(costPrice3) ? 0 : costPrice3.toFixed(2)
    }
})
// 查看详情与修改商品时调用详情接口进行数据反显
const getLook = async () => {
    loading.value = true
    const res = await getSupplierAddProducts(props.AddFormId)
    let params = JSON.parse(JSON.stringify(res.data))
    params.categoryId = params.categoryId?.split(',')
    params.placeDeliveryId = params.placeDeliveryId?.split(',')
    params.hmMechanismsList.forEach((item: any, index: number) => {
        if (index === 0) {
            params.cooperationMode = item.cooperationMode
            params.price = item.price
            params.costPrice = item.costPrice
            params.liveStreamingMechanism = item.liveStreamingMechanism
            params.commission = item.commission
            params.brokerage = item.brokerage
        }
        if (index === 1 && item.cooperationMode) {
            params.cooperationMode2 = item.cooperationMode
            params.price2 = item.price
            params.costPrice2 = item.costPrice
            params.liveStreamingMechanism2 = item.liveStreamingMechanism
            params.commission2 = item.commission
            params.brokerage2 = item.brokerage
            mechanismArr.value.push(2)
        }
        if (index === 2 && item.cooperationMode) {
            params.cooperationMode3 = item.cooperationMode
            params.price3 = item.price
            params.costPrice3 = item.costPrice
            params.liveStreamingMechanism3 = item.liveStreamingMechanism
            params.commission3 = item.commission
            params.brokerage3 = item.brokerage
            mechanismArr.value.push(3)
        }
    })
    // params.placeDelivery = params.placeDelivery ? (params.placeDelivery as string).split('-') : []
    params.productCategoryIs = params?.productCategoryName?.indexOf('饰品') < 0 ? false : true
    formData.value = params
    loading.value = false
    supplierData.value = params.supplierVo

    SupplierList.value = [
        {
            label: formData.value.supplierName,
            value: formData.value.supplierId
        }
    ]
}
/** 删除机制 */
const handleDelete = (index: number) => {
    // 当机制二删除并且机制三也存在得情况 删除机制三 保留机制二
    if (index == 2 && mechanismArr.value.length == 3) {
        mechanismArr.value.splice(2, 1)
        formData.value.cooperationMode2 = formData.value.cooperationMode3
        formData.value.price2 = formData.value.price3
        formData.value.costPrice2 = formData.value.costPrice3
        formData.value.liveStreamingMechanism2 = formData.value.liveStreamingMechanism3
        formData.value.commission2 = formData.value.commission3
        formData.value.brokerage2 = formData.value.brokerage3

        formData.value.cooperationMode3 = ""
        formData.value.price3 = ""
        formData.value.costPrice3 = ""
        formData.value.liveStreamingMechanism3 = ""
        formData.value.commission3 = ""
        formData.value.brokerage3 = ""
    } else {
        let indexs = mechanismArr.value.indexOf(index)
        mechanismArr.value.splice(indexs, 1)
        if (index == 2) {
            formData.value.cooperationMode2 = ""
            formData.value.price2 = ""
            formData.value.costPrice2 = ""
            formData.value.liveStreamingMechanism2 = ""
            formData.value.commission2 = ""
            formData.value.brokerage2 = ""
        } else if (index == 3) {
            formData.value.cooperationMode3 = ""
            formData.value.price3 = ""
            formData.value.costPrice3 = ""
            formData.value.liveStreamingMechanism3 = ""
            formData.value.commission3 = ""
            formData.value.brokerage3 = ""
        }
    }
}
// 锚点
const navClick = (id: string, index: number) => {
    const info: any = document.querySelector(id)
    info.scrollIntoView({ behavior: 'smooth' })
    screenIndex.value = index
}
/** 预览 */
const preview = async (id: string) => {
    const resp: any = await exportCertId(id)
    const blob = window.URL.createObjectURL(new Blob([resp], { type: 'application/pdf' }));
    window.open(blob)
}
/** 下载 */
const handleExport = async (id: string) => {
    const resp: any = await exportCertId(id)

    // 创建一个Blob对象，并传入响应数据  
    const blob = new Blob([resp], { type: 'application/pdf' });

    // 创建一个指向该Blob对象的URL  
    const url = window.URL.createObjectURL(blob);

    // 创建一个下载链接，并模拟点击它  
    const link = document.createElement('a');
    link.href = url;
    link.setAttribute('download', `${formData.value.styleName}信息卡`); // 设置下载的文件名  
    document.body.appendChild(link);
    link.click();

    // 从DOM中移除链接，并释放URL对象  
    link.remove();
    window.URL.revokeObjectURL(url);
}
// 发货地点击
const placeDeliveryChange = (val: any) => {
    console.log(val)
}
// 供应商事件
const onchange = async (e: string) => {
    optionChange(e, 'supplierName', SupplierList.value)
    const res = await hmSupplierList({ id: e })
    supplierData.value = res.rows[0]
}
// 去补充
const addSupplement = () => {
    if (props.disabledName !== '') {
        router.push({ path: '/suppliers/contractDetail' })
    }
}
</script>

<style lang="scss" scoped>
.circular {
    display: inline;
    height: 30px;
    width: 30px;
    animation: loading-rotate 2s linear infinite;
}

.path {
    animation: loading-dash 1.5s ease-in-out infinite;
    stroke-dasharray: 90, 150;
    stroke-dashoffset: 0;
    stroke-width: 2;
    stroke: var(--el-color-primary);
    stroke-linecap: round;
}

.supplierSelect_icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.el-select-loading__tips {
    color: #606266;
    font-size: 14px;
}

.flex {
    display: flex;
    align-items: center;
    font-size: 14px;
    height: 32px;
    line-height: 32px;

    .label {
        width: 120px;
        text-align: right;
        font-weight: 700;
        color: #606266;
        padding: 0 12px 0 0;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        line-height: 1;

        .el-image {
            width: 16px;
            height: 16px;
        }
    }

    .value {
        flex: 1;

    }
}

.addForm {
    width: 100%;
    height: 100%;
    display: flex;
    flex-flow: column;

    .screen {
        display: flex;
        align-items: center;
        cursor: pointer;

        .screen_div {
            width: 106px;
            height: 44px;
            background: #EBF7FF;
            text-align: center;
            line-height: 44px;
            font-weight: 500;
            font-size: 14px;
            color: #0094FF;
        }

        .screen_div_hover {
            width: 106px;
            height: 44px;
            background: #0094FF;
            font-weight: 500;
            font-size: 14px;
            color: #FFFFFF;
            text-align: center;
            line-height: 44px;
        }
    }

    .addForm_for {
        flex: 1;
        min-height: 0;
        overflow-y: auto;

        .taxClassName {
            display: flex;

            .taxClassName_flex {
                flex: 1;
            }

            .taxClassName_img {
                margin-left: 15px;
                margin-top: 7px;
                width: 18px;
                height: 18px;
                cursor: pointer;
            }
        }
    }

}

.examine_item {
    width: 85px;
    height: 22px;
    background: #E7FDEE;
    border-radius: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    font-size: 12px;
    color: #19D11B;
    line-height: 22px;
    margin-right: 10px;

    img {
        width: 14px;
        height: 14px;
        margin-left: 5px;
    }
}

.fontWeight600 {
    font-weight: 600;
    font-size: 16px;
    color: var(--bTextColor);
}

.mb25 {
    margin-bottom: 25px;
}

.add_mechanism_div {
    width: 100%;
    display: flex;
    justify-content: center;

    .add_mechanism {
        width: 275px;
        height: 38px;
        font-size: 16px;

    }
}

.delete_mechanism {
    width: 20px;
    height: 20px;
    position: absolute;
    right: 10px;
    top: 0;
    cursor: pointer;
    z-index: 50;
}

.flex_div {
    display: flex;
    margin-left: 50px;

    .label {
        min-width: 120px;
        font-size: 14px;
        background-color: rgba(240, 246, 255);
        padding: 4px 7px;

        img {
            width: 14px;
            height: 14px;
        }

        margin-right: 10px;
    }

    .value {
        color: #0094FF;
        font-weight: 400;
        font-size: 14px;
        line-height: 27px;
        cursor: pointer;

        span {
            margin-right: 30px;
        }
    }
}

.supplement {
    line-height: 32px;
    color: #409EFF;
    font-size: 14px;
    margin-left: 5px;
    cursor: pointer;
}
</style>